<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        section{
            width: fit-content;
            margin: 50px auto;
        }
    </style>
</head>
<body>
    <section>
        <h2>百度验证</h2>
        <label for="name1">用户名：</label><input type="text" id="name1"><br>
        <label for="cellPNum">手机号：</label><input type="text" id="cellPNum"><br>
        <label for="password">密码： </label><input type="text" id="password">
        <button id="btn">确定</button>
    </section>
    <script>
    //     ## 03。百度验证
    // - 用户名只能最多7个汉字 或者 14个英文字母  只能有14个字符，一个中文表示两个字符
    // -   用户名：14个字母
    // -   手机号：11位数字
    //     +   只能以1开头
    //     +   第二位数 3 5 6 7 8 9
    // -   密码：
    //     +   8-14个字符
    //     +   数字 字母 标点标点符号 组成
    var name1 = document.querySelector('#name1')
    var cellPNum = document.querySelector('#cellPNum')
    var password = document.querySelector('#password')
    var btn = document.querySelector('#btn')

    // var regName = /^.{1}$/
    var regName = /^([\u4e00-\u9fa5]{1,7}|[a-z]{1,14})$/i 
    var regNum = /^1[356789]\d{9}$/
    var regPass = /^[\w,\.，。《》<>;:；：‘’]{8,14}$/
    btn.onclick = function(){
        console.log(name1.value)
       if(!regName.test(name1.value)){
          
            alert('请输入正确的用户名')
       }
       if(!regNum.test(cellPNum.value)){
        //    alert('请输入正确的电话号码')
       }
       if(!regPass.test(password.value)){
        // alert('请输入正确的密码')
       }
      
    }
    </script>
</body>
</html>